<template>
  <Container class="single-sale full-sub-gift-sale">
    <div slot="header" class="container-header title title-center">满减送促销</div>
    <div class="bg-light">
      <div class="container-title">
        <span>促销规则</span>
        <Button type="primary" @click="onEditRule">修改促销</Button>
      </div>
      <Form ref="form" :label-width="100">
        <Row>
          <i-col span="8">
            <FormItem label="促销名称：">{{ $store.state.fullSubGiftSale.form.name }}</FormItem>
            <FormItem
              label="促销时间："
            >{{ $store.state.fullSubGiftSale.form.date[0] | dateTime }}-{{ $store.state.fullSubGiftSale.form.date[1] | dateTime }}</FormItem>
            <FormItem label="活动对象：">{{ fullGiftgrade }}</FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="参与方式：">部分参与</FormItem>
            <FormItem label="促销规则：">
              <div>优惠条件{{ $store.state.fullSubGiftSale.form.con }}元</div>
              <div v-if="$store.state.fullSubGiftSale.form.reduceCheck">
                <span>减金额{{ $store.state.fullSubGiftSale.form.reduce }}元</span>
              </div>
              <div v-if="$store.state.fullSubGiftSale.form.addCheck">
                <span>加价购金额{{ $store.state.fullSubGiftSale.form.add }}元</span>
              </div>
              <div>
                <span>有无赠品:{{ hasGift }}</span>
              </div>
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="活动备注：">
              <div>{{ $store.state.fullSubGiftSale.form.remark }}</div>
            </FormItem>
            <!-- <FormItem label="参加商品：">部分商品参加</FormItem> -->
          </i-col>
        </Row>
      </Form>
    </div>
    <div class="bg-light mt">
      <div class="container-header">
        <SearchSale @onSearchData="onSearchData" />
      </div>
      <Tabs v-model="tab">
        <Button
          v-if="tab === 'tab1'"
          slot="extra"
          class="item"
          type="primary"
          icon="md-add"
          @click="onJoinAdd"
        >批量加入</Button>
        <Button
          v-if="tab === 'tab2'"
          slot="extra"
          class="item"
          type="primary"
          icon="md-add"
          @click="onJoinDelete"
        >批量撤出</Button>
        <TabPane label="选择主商品" name="tab1">
          <choiceCommidy ref="choiceCommidy" />
        </TabPane>
        <TabPane :label="label1" name="tab2">
          <mainCommidy ref="mainCommidy" />
        </TabPane>
      </Tabs>
    </div>
    <div slot="footer" class="container-footer bg-white">
      <Button size="large" @click="jumpPrevPage">返回</Button>
      <Button
        v-show="$store.state.fullSubGiftSale.form.giftCheck"
        type="primary"
        size="large"
        class="ml"
        @click="jumpPage"
      >下一步</Button>
      <Button
        v-show="!$store.state.fullSubGiftSale.form.giftCheck"
        type="primary"
        size="large"
        class="ml"
        :loading="loading"
        @click="onJoinPrevent"
      >保存</Button>
    </div>
  </Container>
</template>
<script>
import SearchSale from '@/views/sales/common/SearchSale'
import choiceCommidy from './list/ChoiceCommidyItem'
import mainCommidy from './list/MainCommidyItem'
import { formatDate } from './list/FullsubGiftListMethods'
import { getPuduct } from '@/views/sales/common/TableSaleMethods'
export default {
  components: {
    choiceCommidy,
    mainCommidy,
    SearchSale
  },
  data () {
    return {
      id: this.$route.query.id || '',
      type: this.$route.query.type || '',
      tab: 'tab1',
      loading: false,
      label1: (h) => {
        return h('div', [
          h('span', '已选主商品'),
          h('Badge', {
            props: {
              count: this.getSaleNum
            }
          })
        ])
      }
    }
  },
  computed: {
    fullsubgiftAdd () {
      if (this.$store.state.fullSubGiftSale.form.addCheck) {
        return this.$store.state.fullSubGiftSale.form.add
      } else {
        return ''
      }
    },
    fullsubgiftReduce () {
      if (this.$store.state.fullSubGiftSale.form.reduceCheck) {
        return this.$store.state.fullSubGiftSale.form.reduce
      } else {
        return ''
      }
    },
    getSaleNum () {
      return this.$store.getters.getFullsubGiftSaleNum
    },
    promotionMemberScope () {
      return this.$store.state.fullSubGiftSale.form.grade
    },
    fullGiftgrade () {
      return this.$store.getters.fullGiftgrade
    },
    hasGift () {
      return this.$store.getters.hasGift
    },
    grade () {
      return this.$store.state.fullSubGiftSale.form.grade.join(',')
    },
    timeList () {
      return [
        {
          startDatetime: formatDate(
            this.$store.state.fullSubGiftSale.form.date[0],
            true
          ),
          endDatetime: formatDate(
            this.$store.state.fullSubGiftSale.form.date[1],
            true
          )
        }
      ]
    },
    productSkuList () {
      return getPuduct(this.$store.state.fullSubGiftSale.GetsaleData, {
        child: 'productSkuList',
        getParam: ['productId', 'id', 'parentcode', 'code']
      })
    },
    giftSkuList () {
      return []
    }
  },
  mounted () {
    if (this.id && !this.$store.state.fullSubGiftSale.GetsaleData.length) this.getData()
  },
  methods: {
    getData () {
      this.$ajaxGet(`/activity/activity_sku_list/${this.id}`).then(data => {
        this.$store.state.fullSubGiftSale.GetsaleData = (data || []).map(item => {
          return {
            id: item.item[0].productId,
            checked: false,
            buttonChecked: false,
            showChildren: false,
            sale: '',
            limitQuantity: '',
            code: item.productSn,
            salePrice: '',
            reduce: '',
            stock: '',
            isShelf: item.isShelf,
            discount: '',
            title: item.title,
            quantity: item.quantity,
            productSkuList: item.item.map(todo => {
              return {
                id: todo.skuId,
                productId: todo.productId,
                productSn: todo.productSn,
                parentcode: item.productSn,
                checked: false,
                buttonChecked: false,
                showChildren: false,
                limitQuantity: '',
                code: todo.skuSn,
                salePrice: todo.productSkuInfo.salePrice,
                reduce: '',
                sale: todo.promotionPrice,
                isShelf: todo.isShelf,
                discount: '',
                title: '',
                stock: todo.productSkuInfo.stock,
                returnPrice: '',
                quantity: item.quantity
              }
            })
          }
        })
        this.onSearchData()
      })
    },
    jumpPrevPage () {
      this.$router.back()
    },
    onSearchData (param) {
      this.$refs.choiceCommidy.getProductData(param)
    },
    onEditRule () {
      this.$Modal.confirm({
        title: '温馨提示',
        content: '您确定要修改活动吗？修改活动当前页面不保存',
        onOk: () => {
          this.$router.push({
            name: 'sales/fullSubGift'
          })
        }
      })
    },
    jumpPage () {
      let self = this
      let url = { name: 'sales/fullSubGift/select/gift', query: {} }
      if (self.id) {
        url.query.id = self.id
        if (this.type) url.query.type = self.type
      }
      this.$router.push(url)
    },
    onJoinAdd () {
      this.$refs.choiceCommidy.getSaleData('checked')
    },
    onJoinDelete () {
      this.$refs.mainCommidy.deleteSaleData()
    },
    onJoinPrevent () {
      let self = this
      self.loading = true
      let url = '/activity/full_cut_gift/save'
      if (this.id && this.type) url = '/activity/full_cut_gift/modify'
      let param = {
        activityFullCutGiftDTO: {
          addBuyAmount: this.fullsubgiftAdd, //加价购价格
          discountCondition: this.$store.state.fullSubGiftSale.form.con, //优惠条件
          discountCutAmount: this.fullsubgiftReduce, //优惠减多少钱
          isGiftProduct: this.$store.state.fullSubGiftSale.form.giftCheck, //是否赠品
          isParcel: this.$store.state.fullSubGiftSale.form.isParcel
        },
        activityInfoDTO: {
          activityDescription: this.$store.state.fullSubGiftSale.form.remark, //活动备注
          activityName: this.$store.state.fullSubGiftSale.form.name, //活动名称
          endDate: this.timeList[0].endDatetime,
          startDate: this.timeList[0].startDatetime,
          joinTypeEnum: 'PART',
          storeTypeEnumList: this.promotionMemberScope,
          productSkuList: this.productSkuList,
          shelfStatusEnum: 'ON'
        }
      }
      if (this.id && this.type) param.activityFullCutGiftDTO.activityId = this.id
      this.$jsonPost(url, param).then(
        data => {
          self.$Message.success((this.id && this.type) ? '编辑活动成功' : '新增活动成功')
          self.$store.commit('setFullSubGiftSaleEmpty')
          self.$router.push({ name: 'sales/list' })
          self.loading = false
        }
      ).catch(data => {
        self.loading = false
      })
    }
  }
}
</script>

